<template>
  <div class="ebook-reader">
    <div id="read">
    </div>
  </div>
</template>

<script>
  import Epub from 'epubjs'
  import {mapState, mapActions, mapGetters} from 'vuex'

  global.ePub = Epub
  export default {
    name: "EbookReader",
    computed: {
      ...mapGetters(['fileName'])
    },
    methods: {
      // 初始化filename
      initEpub() {
        const url = "http://127.0.0.1:8081/epub/" + this.fileName + ".epub"
        this.book = new Epub(url);
        this.rendition = this.book.renderTo(read, {
          width: innerWidth,
          height: innerHeight,
          method: 'default'
        })
        this.rendition.display()
      }
    },
    mounted() {
      // const baseUrl = "http://127.0.0.1:8081/epub"
      const fileName = this.$route.params.fileName.split("|").join("/")
      this.$store.dispatch('setFileName', fileName).then(() => {
        this.initEpub()
      })
    }
  }
</script>

<style scoped>

</style>
